<template>
  <h1>{{ xxx }}</h1>
  <button @click="btnClick">点击xxx++</button>
  <h3>{{ abc }}</h3>
  <button @click="fn">点击</button>
</template>
<script>
import { ref } from 'vue'

// export default {
//   setup () {
//     // let xxx = reactive({ num: 0 })
//     let xxx = ref(0)

//     const btnClick = () => {
//       xxx.value++
//       console.log(xxx)
//     }

//     return { xxx, btnClick }
//   }
// }
//
</script>
<script setup>
// setup语法糖   return不用写了，全局定义的东西都return
import { ref } from 'vue'
let xxx = ref(0)
const btnClick = () => {
  xxx.value++

  console.log(xxx)
}
function fn() {
  console.log('fn')
}
let abc = true
</script>
